<template>
	<div>
		<div class="recommend-title">周末去哪儿</div>
		<ul>
			<li class="item border-bottem" v-for="item of list" :key="item.id">
				<div class="item-img-wrapper">
					<img class="item-img" :src="item.imgUrl" alt="">
				</div>
				<div class="item-info">
					<p class="item-title">{{item.title}}</p>
					<p class="item-desc">{{item.desc}}</p>
				</div>

			</li>
		</ul>
	</div>
</template>

<script>
export default {
  name: 'HomeWeekend',
  props: {
  	list:Array
  },
  data () {
  	return{
  		// recommendList:[
  		// 	{
  		// 		"id": "0001",
  		// 		"imgUrl": "http://img1.qunarzz.com/sight/source/1505/aa/7baaf8a851d221.jpg_r_640x214_1431200f.jpg",
  		// 		"title": "学生最爱的博物馆",
  		// 		"desc": "周末干嘛？北京很多博物馆已经免费开放啦"
  		// 	},
  		// 	{
  		// 		"id": "0002",
  		// 		"imgUrl": "http://img1.qunarzz.com/sight/source/1505/b2/fde1bfcd057a52.jpg_r_640x214_bbf3fa44.jpg",
  		// 		"title": "儿童剧场，孩子的乐园",
  		// 		"desc": "带宝贝观看演出，近距离体验艺术的无穷魅力"
  		// 	},
  		// 	{
  		// 		"id": "0003",
  		// 		"imgUrl": "http://img1.qunarzz.com/sight/source/1507/18/2d554e22faa25f.jpg_r_640x214_2a966a54.jpg",
  		// 		"title": "爱上庄园",
  		// 		"desc": "庄园让臭美的你秒变白富美，高富帅"
  		// 	},
  		// ]
  	}
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="stylus" scoped>
	@import '~styles/mixins.styl'
	.recommend-title
		line-height:.8rem
		background:#eee
		text-indent:.2rem
	.item-img-wrapper
		overflow:hidden
		height:0
		padding-bottom:33.9%
		.item-img
			width:100%
	.item-info
		padding:.1rem
		.item-title
			line-height:.54rem
			font-size:.32rem
			ellipsis()
		.item-desc
			line-height:.4rem
			color:#ccc
			ellipsis()
				
</style>
